<template>
    <div class="login">
        <div class="warp">
            <p>欢迎回来</p>
            <el-form label-position="right" label-width="80px" @submit="login" :model="loginData">
                <el-form-item label="电话号码">
                    <el-input v-model="loginData.username"></el-input>
                </el-form-item>
                <el-form-item label="密码">
                    <el-input v-model="loginData.password" type="password"></el-input>
                </el-form-item>
                <!-- <el-form-item label="验证码">
                    <el-input v-model="loginData.code"></el-input>
                </el-form-item> -->
                <el-form-item>
                    <el-button type="primary" @click="login">登陆</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>
export default {
    name:'login',
    data () {
        return {
            loginData:{
                username:'',
                password:''
            }
        }
    },
    methods:{
        login(){
            this.$store.dispatch('login/login', this.loginData)
        }
    },
    created(){
        this.$store.commit('login/SET_VM',{vm:this})
    }
}
</script>

<style lang="scss">
    .login{
        width: 100%;
        .warp{
            width: 400px;
            margin: 100px auto;
            p{
                text-align: center;
                font-size: 28px;
                color: #409EFF;
            }
        }
    }
</style>


